<script setup lang="ts">
import {reactive} from "vue";
import Vue005Son from "./Vue005Son.vue";
import Vue005Son2 from "./Vue005Son2.vue";

const data = reactive({
  money:100,
  books:["西游记","水浒传"]
})

function moneyMinis(arg) {
  // alert("感知到儿子买了棒棒糖" + arg);
  data.money += arg;
}
</script>

<template>

  <button @click="data.money+=10">充值</button>

<!-- @buy 感知buy事件，并通过函数结束事件的值 -->
  <Vue005Son2 v-bind="data" @buy="moneyMinis">
    <template v-slot:title>
      哈哈SonSon
    </template>

<!--  v-slot的简写方式，#  -->
    <template #button>
      <button>哈哈SonSon22</button>
    </template>
  </Vue005Son2>


</template>

<style scoped>

</style>